.method-msg-container {
  .method-msg-bkg-area {
    position: relative;
    width: 100vw;
    height: 500px;
    background: url('../../../static/upload/img_fuye_bg@3x.jpg') no-repeat
      center;
    background-size: 100vw 500px;
    .method-msg-title {
      position: absolute;
      top: 295px;
      width: 100vw;
      height: 82px;
      text-align: center;

      .method-msg-text {
        margin-top: 18px;
        font-size: 32px;
        color: #ffffff;
      }
      &.xuexiao {
        background: url('../../../static/upload/img_biaoti_da_huang@3x.png')
          no-repeat center;
        background-size: 508px 90px;
      }
      &.jiating {
        background: url('../../../static/upload/img_biaoti_da_zi@3x.png')
          no-repeat center;
        background-size: 508px 90px;
      }
    }
  }
  .method-msg-area {
    position: relative;
    margin-top: -90px;
    height: 100%;
    z-index: 100;
    border-radius: 60px 60px 0 0;
    background: #ffffff;
    .msg-area-title {
      width: 318px;
      height: 82px;
      line-height: 70px;
      font-size: 32px;
      color: #ffffff;
      text-align: center;
      // background: url('../../../static/upload/img_biaoti_xiao_huang@3x.png')
      //   no-repeat center;
      // background-size: 318px 82px;
      position: relative;
      top: -19px;
      left: calc(50vw - 159px);
      &.xuexiao {
        background: url('../../../static/upload/img_biaoti_xiao_huang@3x.png')
          no-repeat center;
        background-size: 318px 82px;
      }
      &.jiating {
        background: url('../../../static/upload/img_biaoti_xiao_zi@3x.png')
          no-repeat center;
        background-size: 318px 82px;
      }
    }
    .method-msg-input {
      padding: 0 80px;
      .input-item {
        height: 99px;
        line-height: 99px;
        border-bottom: 1px solid #e6e6e6;
        display: flex;
        .item-title {
          font-size: 28px;
          color: #333333;
          letter-spacing: 0;
          width: 140px;
          // margin-right: auto;
          // padding-right: auto;
        }
        .input-main {
          border: none;
          flex: 1;
          width: 0;
          font-size: 28px;
          color: #333333;
          outline-style: none;
          outline-width: 0;
          border: none;
          text-shadow: none;
          -webkit-appearance: none;
          -webkit-user-select: text;
          outline-color: transparent;
          -webkit-box-shadow: none;
          box-shadow: none;
          &.age {
            // height: 99px;
            // line-height: 99px !important;
            // // -webkit-writing-mode: horizontal-tb !important;
            // // text-rendering: auto;
            // letter-spacing: normal;
            // word-spacing: normal;
            // text-transform: none;
            // text-indent: 0px;
            // text-shadow: none;
            // // display: inline-block;
            // // text-align: start;
            // background-color: -internal-light-dark-color(
            //   rgb(255, 255, 255),
            //   rgb(59, 59, 59)
            // );
            // // -webkit-rtl-ordering: logical;
            // cursor: text;
            // font: 400 13.3333px Arial;
            margin: 1px 2px !important;
          }
          &.none {
            color: #909090;
          }
        }
      }
      .rules-area {
        font-size: 24px;
        color: #989898;
        line-height: 42px;
        margin: 40px 0 0;
        display: flex;
        align-items: center;
        .rule-icon-nocheck {
          width: 30px;
          height: 30px;
          margin-right: 3px;
          border-radius: 50%;
          border: 2px solid #e5e5e5;
        }
        .rule-icon-check {
          width: 30px;
          height: 30px;
          border-radius: 50%;
          background-color: red;
          margin-right: 7px;
          background: url('../../../static/upload/icon_gouxuan_ok@3x.png')
            no-repeat -10px;
          background-size: 50px 50px;
        }

        .rule-link {
          color: #e23e48;
        }
      }
      .signup-btn {
        width: 380px;
        height: 80px;
        line-height: 80px;
        text-align: center;
        margin: 84px auto 0;
        background-image: linear-gradient(-126deg, #e23e48 0%, #d03c50 100%);
        box-shadow: 0 16px 15px -7px rgba(224, 64, 82, 0.42);
        border-radius: 40px;
        // 自提
        font-size: 30px;
        color: #ffffff;
        letter-spacing: 3px;
        text-align: center;
        &.no-use {
          background-image: linear-gradient(-126deg, #d4d4d4 0%, #b6b6b6 100%);
          box-shadow: 0 16px 15px -7px rgba(171, 171, 171, 0.42);
          border-radius: 40px;
        }
      }
    }
  }
  // 弹窗提示部分
  .confirm-pop-area {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999;
    background: rgba(0, 0, 0, 0.7);
    text-align: center;
    .pop-icon {
      width: 330px;
      height: 229px;
      text-align: center;
      margin: calc(50vh - 355px) auto 0;
    }
    .pop-main {
      padding: 81px 67px 0;
      width: 546px;
      height: 289px;
      margin: -19px auto 0;
      background: #ffffff;
      border-radius: 32px;
      text-align: left;
      .pop-desc {
        font-size: 28px;
        color: #353535;
        line-height: 50px;
        font-weight: 700;
      }
      .pop-btns {
        height: 100px;
        line-height: 80px;
        display: flex;
        justify-content: space-between;
        margin-top: 50px;
        .btn-item {
          height: 80px;
          width: 256px;
          text-align: center;
          border: 2px solid #c72c36;
          border-radius: 40px;
          font-size: 30px;
          color: #c72c36;
          letter-spacing: 3px;
          &.confirm {
            background: #c72c36;
            color: #ffffff;
            box-shadow: 0 16px 15px -7px rgba(224, 64, 82, 0.42);
          }
        }
      }
    }
  }
}
